<template>
  <div id="app">
    <Headerbox v-if="isheader" />
    <div
      class="contentBox"
      :style="isheader ? 'height: calc(100vh - 56px)' : 'height:100vh'"
    >
      <router-view />
    </div>
  </div>
</template>

<script>
import Headerbox from "./components/headerbox.vue";
export default {
  name: "App",
  data() {
    return {
      isheader: true,
    };
  },
  components: {
    Headerbox,
  },
  mounted() {
    if (this.$route.path === "/login") {
      this.isheader = false;
    } else {
      this.isheader = true;
    }
  },
  created() {
    if (this.$route.path === "/login") {
      this.isheader = false;
    } else {
      this.isheader = true;
    }
  },
  watch: {
    "$route.path": function (newVal, oldVal) {
      if (newVal === "/login") {
        this.isheader = false;
      } else {
        this.isheader = true;
      }
    },
  },
  methods: {
    a() {
      // 配合main.js 里的axios 和 qs 使用
      // this.$axios({
      //   method: "post",
      //   url: "http://39.105.58.216:14001/user/login",
      //   // responseType: "blob", /// 设置相应头
      //   // `headers`是要发送的自定义请求头
      //   // headers: { "X-Requested-With": "XMLHttpRequest" },
      //   data: this.qs.stringify({
      //     account: "admin",
      //     password: "admin",
      //   }),
      // }).then((res) => {
      //   ///打印得到的数据
      //   console.log("打印的数据", res);
      // });
    },
  },
};
</script>

<style>
#app {
  margin: -8px;
  padding: 0px;
  /* font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px; */
}
.contentBox {
  background: #f7f8fa;
  height: calc(100vh - 56px);
  overflow-y: auto;
}
.titStyle {
  display: inline-block;
  font-weight: 600;
  color: #424656;
  font-size: 16px;
  padding-left: 16px;
  border-left: 2px solid #128075;
}
.xiqngqing {
  display: inline-block;
  background: rgba(89, 186, 137, 0.2);
  padding: 6px 16px;
  color: #01575c;
  font-size: 14px;
  border-radius: 2px;
  cursor: pointer;
}
.twoTittext {
  font-size: 14px;
  color: #1d310d;
  font-weight: 600;
}

::-webkit-scrollbar {
  width: 12px;
}
/* 滚动槽 */
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.3);
  border-radius: 10px;
}
/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.5);
}
</style>
<style >
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
  color: #01575c;
  font-weight: 700;
  background-color: #fff;
  border-color: #dcdfe6;
  box-shadow: -1px 0 0 0 #dcdfe6;
}
.el-radio-button__inner:hover {
  color: #01575c;
}
.el-radio-button:last-child .el-radio-button__inner {
  border-radius: 0 2px 2px 0;
}
.el-progress-bar {
  padding-right: 0px;
}
.el-slider__bar {
  background-color: #277074;
}
.el-slider__button {
  border: 2px solid #277074;
}
.el-table--border th.el-table__cell,
.el-table__fixed-right-patch {
  background: #F7F8FA;
}
.el-tabs__nav-wrap::after {
  background-color: #fff;
}
.el-tabs__item:hover {
  color: #128075;
}
.el-tabs__item.is-active {
  color: #128075;
}
.el-tabs__active-bar {
  background-color: #128075;
}
.el-tabs__header {
  margin: 0px;
}
</style>
